<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="en-us" http-equiv="Content-Language" />
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Homepage</title>
</head>
<style>
*{padding:0;margin:0;}
body{text-align:center;background-color:#f5f5f5;}
#search_input{height:1.8em;line-height:1.8em;width:92%;outline:none;border:none;font-size: 0.85em;text-align:center;background: #eee;border-radius:15px;color:#666;padding-left:4%;padding-right:4%;}
#search_input:focus {text-align:left;}
span {display: block;overflow: hidden;padding-left:5px;vertical-align:middle;}
.search_bar{display:table; vertical-align:middle;width:80%;height:1.8em;background: transparent;text-align:center;margin-left:10%;margin-right:10%;position:fixed;bottom:10px;}
#content{width:100%;text-align:center;padding-top:15px;padding-bottom:15px;}
.box {position:relative;display: inline-block;width: 75px;border: 0;}
.box a {width: 100%;height: 100%;position: absolute;left: 0;top: 0;}
.url {color: #43505a;height: 1.5em;line-height: 1.5em;width: 72px;font-size: 0.75em;white-space: nowrap;overflow: hidden;margin: auto;text-overflow: ellipsis;-o-text-overflow: ellipsis;-ms-text-overflow: ellipsis;padding-top:3px;padding-bottom:8px;}
.icon{width:3em;height: 3em;max-width:72px;}
</style>

<body>

<form onsubmit="return search()" class="search_bar">
<span><input type="text" value="乐回享" placeholder="搜索" autocomplete="off" id="search_input" ></span>
</form>

<div id="content">

<div class="box">
<a href="folder://"></a>
<p><img class="icon" src="img/bookmark.png" ></p>
<p class="url">书签</p>
</div>

<div class="box">
<a href="history://"></a>
<p><img class="icon" src="img/history.png" ></p>
<p class="url">历史</p>
</div>

<div class="box">
<a href="http://coolapk.com/"></a>
<p><img class="icon" src="img/coolapk_alt.png" ></p>
<p class="url">酷安</p>
</div>

<div class="box">
<a href="https://www.google.com"></a>
<p><img class="icon" src="img/google.png" ></p>
<p class="url">Google</p>
</div>

<div class="box">
<a href="http://w.mail.qq.com/cgi-bin/loginpage?f=xhtml&kvclick=loginpage|app_push|enter|android&ad=false&f=xhtml"></a>
<p><img class="icon" src="img/sony_email.png" ></p>
<p class="url">QQ邮箱</p>
</div>

<div class="box">
<a href="http://tieba.baidu.com/?page=like"></a>
<p><img class="icon" src="img/baidu_tieba.png" ></p>
<p class="url">百度贴吧</p>
</div>

<div class="box">
<a href="http://zhihu.com"></a>
<p><img class="icon" src="img/zhihu.png" ></p>
<p class="url">知乎</p>
</div>

<div class="box">
<a href="https://m.weibo.com"></a>
<p><img class="icon" src="img/weibo.png" ></p>
<p class="url">微博</p>
</div>

</div>

<script type="text/javascript">function search(){if(document.getElementById("search_input").value != ""){window.location.href = "https://m.baidu.com/s?from=1011440l&word=" + document.getElementById("search_input").value;document.getElementById("search_input").value = "";}return false;}</script>

</body>
</html>